<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<jsp:useBean id="expressionMap" scope="page" class="cn.sumpu.app.guoguojie.domain.Ext.Expression" />
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>

<script type="text/javascript">

	//表情小试牛刀
	function showExpression(self){
		$(self).parent().find("#expression_all").show();
		//鼠标离开后表情隐藏
		$(self).parent().parent().parent().parent().parent().parent().parent().mouseleave(function(){
			$(self).parent().find("#expression_all").hide();
		});
	}
	
	//添加表情
	function addExpression(self){
		$("#commentText").insertAtCaret(self.alt);
	}
	
</script>
<style>
<!--
.h_bqText {
	position: absolute;
	width: 262px;
	height: 157px;
	border: 1px solid #D3D4D4;
	left: 0;
	top: 25px;
	background: white;
	padding-left: 7px;
	border-image: initial;
}

.h_bqText_bg {
	width: 53px;
	height: 23px;
	background: url(images/home_images/bq_bg.gif) no-repeat;
	position: absolute;
	left: -1px;
	top: -23px;
}

.h_bqText_img {
	line-height: 15px;
}

.h_bqText_img img {
	border: 1px solid #CCC;
	margin: 4px 5px 0 0;
	border-image: initial;
}
-->
</style>
<div style="float: left; position: relative; z-index: 3; cursor: pointer;" class="h_bqText_img">
		<ul id="expression_leave" style="float: left;z-index: 100;">
          <li class="h_bq" style="z-index: 100;border: 0;padding: 0 5px;">
          <a href="javascript:void(0);" onclick="showExpression(this)">
          	<img alt="表情" src="imgs/biaoqing.gif" class="fl add_face" style="border: 0px;" >
          </a>
            <div class="h_bqText" style="display:none;" id="expression_all" >
              <div class="h_bqText_bg"></div>
              <div class="h_bqText_img">
              <c:forEach items="${pageScope.expressionMap.expressionMap }" var="e">
              	<img src="images/expression/${e.key }" style="cursor: pointer;"
              	 title="${e.value }" onclick="addExpression(this)" alt="${e.value }" />
              </c:forEach>
              </div>
              <%--
              <div class="h_bqPage"><a href="javascript:void(0);" class="h_bqPage_left" class="h_bqPage">上页</a><a href="#" class="h_bqPage_right">下页</a></div>
               --%>
            </div>
          </li>
        </ul>
</div>